<!--
 * @Author: Lw
 * @Date: 2022-09-02 12:44:44
 * @LastEditors: LHL
 * @LastEditTime: 2022-10-18 13:41:25
-->
<template>
  <Form
    :options="options"
    :form="form"
    :inline="true"
    :cols="5"
    :isBtnItem="true"
    @change="(params) => emit('change', params)"
    labelWidth=""
  >
    <template #formItem="{ key, value }">
      <slot :key="key" :value="value"></slot>
    </template>
    <template #btnItem>
      <n-space v-if="showBtn" style="width: 100%">
        <n-button type="primary" size="large" @click="() => emit('search')">查询</n-button>
        <n-button type="primary" size="large" @click="() => emit('reset')" secondary>重置</n-button>
      </n-space>
    </template>
  </Form>
</template>

<script setup>
  import Form from '@/components/Form/index.vue'
  const emit = defineEmits(['search', 'reset', 'change'])
  const props = defineProps({
    options: {
      type: Array,
      required: true,
    },
    form: {
      type: Object,
      required: true,
    },
    showBtn: {
      type: Boolean,
      default: true,
    },
  })
  // const cols = computed(() => {
  //   const length = props.options?.length
  //   if (length) {
  //     switch (length) {
  //       case 5:
  //         return 6
  //       default:
  //         return 5
  //     }
  //   } else {
  //     return 5
  //   }
  // })
</script>

<style lang="scss" scoped></style>
